import VueRouter from "vue-router";

const routes = [
    // 定义登录页面的路由
    {
        path: '/', // 路径为应用的根路径
        name: 'login', // 路由的名称，可用于编程式导航
        component: () => import('../components/MyLogin') // 动态导入登录组件
    },
    // 定义Index页面的路由，该页面包含嵌套路由
    {
        path: '/Index', // Index页面的路径
        name: 'index', // 路由的名称
        component: () => import('../components/MyIndex'), // 动态导入Index组件
        children: [ // 定义子路由
            // 定义Home页面的子路由
            {
                path: '/Home', // Home页面的路径，相对于父路由
                name: 'home', // 子路由的名称
                meta: { // 路由元信息，可以用来传递额外的信息，如页面标题
                    title: '首页' // 页面标题
                },
                component: () => import('../components/MyHome.vue') // 动态导入Home组件
            }
        ]
    }
]
// 创建一个新的 VueRouter 实例，并传入配置项
const router = new VueRouter({
    mode: 'history', // 设置路由模式为 'history'，用于无#号的URL
    routes // 传入定义好的路由配置数组
})

// 导出一个重置路由的函数,用于退出登录
export function resetRouter() {
    // 通过创建一个新的 VueRouter 实例，并将 matcher 属性赋值给当前路由实例的 matcher，
    // 这样可以清空当前路由的所有路由规则，相当于重置路由

    // console.log('resetRouter前的路由配置:')
    // console.log(router.options.routes) // 调试：输出当前的路由配置
    // console.log(router)
    // console.log(router.matcher)
    router.matcher = new VueRouter({
        mode: 'history',
        routes: [] // 初始化一个空的路由规则数组
    }).matcher//匹配器
    // console.log('resetRouter后的路由配置:')
    // console.log(routes) // 调试：输出当前的路由配置
    // console.log(router)
    // console.log(router.matcher)
}

// 当尝试导航到当前路由时。Vue Router 会抛出一个 “NavigationDuplicated” 错误，因为你正试图跳转到一个你已经在访问的路径。

// 保存 VueRouter.prototype.push 的原始实现，便于后续调用
const VueRouterPush = VueRouter.prototype.push;

// 重写 VueRouter.prototype.push 方法，捕获路由跳转时的潜在错误
// 在调用原始 push 方法的基础上，处理因重复导航等情况产生的异常
VueRouter.prototype.push = function push(to) {
    // 输出日志，便于调试，在控制台打印信息以便确认此方法的调用
    console.log('VueRouterPush.call(this, to).catch(err => err)');

    // 调用原始的 push 方法，并捕获可能出现的错误
    // 如果导航过程中遇到重复跳转等错误，返回错误对象而不是抛出异常
    return VueRouterPush.call(this, to).catch(err => err);
}

// 导出配置好的路由实例，以便在 Vue 应用中使用
export default router;


